﻿@import "_variables.less";

body
{
    /* Move down content because we have a fixed navbar that is 50px tall */
    padding-top: 50px;
    background-color: @color-bg;
    color: @color-font;
}

    body::after
    {
        content: "";
        background-image: url('Images/AC.png');
        background-repeat: no-repeat;
        background-position: center center;
        opacity: 0.2;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        position: fixed;
        z-index: -1;
    }

.navbar-fixed-top
{
    /* Hide default border to remove 1px line.*/
    border: 0;
    background-color: @color-bg-invert;
    height: @size-header-height;

    .navbar-right
    {
        margin-right:1px;
    }
}



.sidebar
{
    position: fixed;
    top: @size-header-height;
    bottom: 0;
    left: 0;
    z-index: 1100;
    display: block;
    padding: 0 20px 20px 20px 20px;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: @color-bg-trans;
    border-right: 1px solid @color-bg-light;
    box-shadow: inset -20px 0 10px -15px rgba(0,0,0,0.1);
}

.nav-sidebar
{
    /* 20px padding + 1px border */
    margin-right: -21px;
    margin-bottom: 20px;
    margin-left: -20px;

    > li > a
    {
        padding-right: 20px;
        padding-left: 20px;
        color: @color-font;
        font-size: 16px;
    }

    > li a.active,
    > li a.active:hover,
    > li a.active:focus
    {
        color: @color-font-invert;
        background-color: @color-bg-light;
    }

    > li > ul > li > a
    {
        padding-left: 40px;
        padding-top: 5px;
        padding-bottom: 5px;
        color: @color-font;
    }
}

.main
{
    padding-right: 40px;
    padding-left: 40px;
    padding-bottom: 40px;

    h1
    {
        margin-top: 20px;
        border-bottom: 1px solid @color-bg-light;
    }

    h2
    {
        padding-bottom: 10px;
        border-bottom: 1px solid @color-bg-light;
    }

    .pagination
    {
        border-radius: 0 !important;

        a, a:hover, a:focus
        {
            color: @color-font;
            border-radius: 0 !important;
            border: none;
            background-color: transparent;
        }

        a:hover, a:focus
        {
            color: @color-font-invert;
            background-color: @color-bg-light;
        }
    }

    .btn, .form-control
    {
        border-radius: 0 !important;
    }

    #logManagement
    {
        padding: 100px 0 0 0;

        .fixed
        {
            top: 140px;
            position: fixed;
            width: auto;
            display: none;
            border: none;
            background-color: rgba(255, 255, 255,.9);
            box-shadow: 0 0 10px 5px rgba(0,0,0,0.1);
            z-index: 1000 !important;
        }

        tbody tr:hover td
        {
            background: @color-bg-light !important;
            color: @color-font-invert;
        }

        #logHeader
        {
            background-color: rgba(255, 255, 255,.9);
            position: fixed;
            margin-left: -40px;
            padding-left: 40px;
            box-shadow: 0 0 10px 5px rgba(0,0,0,0.1);
            top: @size-header-height;
            z-index: 1010 !important;

            + h2
            {
                margin-top: 100px;
            }
        }

        #logPager
        {
            background-color: rgba(255, 255, 255,.9);
            box-shadow: 0 0 10px 5px rgba(0,0,0,0.1);
            position: fixed;
            bottom: 0;
            margin-left: -40px;
            padding-left: 40px;

            > .pagination
            {
                margin-bottom: 0;
                margin-top: 0;
            }
        }
    }
}

footer
{
    color: rgba(0,0,0,.2);
    margin-right: 40px;
    z-index: 1011 !important;
    position: fixed;
    bottom: 0;
    right: 5px;
}
